<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<script type="text/javascript">
    require([ "dojo/_base/array", "dojo/_base/xhr", "dojo/request", "dojo/topic", "dojo/json" ], function(array, xhr,
            request, topic, JSON) {
        var syncDB = function(url, jsonData) {
            request.post(url, {
                data : jsonData,
                headers : {
                    'Content-Type' : "application/json; charset=utf-8"
                },
                timeout : 30000
            }).then(function(response) {
                topic.publish("notifyMsgTopic", {
                    message : "操作成功!",
                    type : "message",
                    duration : 1000
                });
            }, function(error) {
                alert(error);
            });
        };
        syspermitmenuSubmitForm = function() {
            var id = jQuery("#syspermitmenuGird").jqGrid('getGridParam', 'selrow');
            if (id == null) {
                alert('请选择一个权限!');
            } else {
                var zTree = jQuery.fn.zTree.getZTreeObj("permitMenuTree");
                var nodes = zTree.getCheckedNodes(true);
                if (nodes.length <= 0) {
                    alert("请选择至少一个菜单!");
                    return;
                }
                var menus = [];
                array.forEach(nodes, function(entry, i) {
                    menus[i] = {
                        menuid : entry.menuid,
                        permitid : id
                    };
                });
                syncDB("syspermitmenu/insert", JSON.stringify(menus));
            }
        };
        var setting = {
            async : {
                enable : true,
                url : "syspermitmenu/queryAsList",
                otherParam : {
                    "permitid" : jQuery("#permitid").val()
                }
            },
            check : {
                enable : true,
                chkboxType : {
                    "Y" : "s",
                    "N" : "ps"
                }
            },
            data : {
                key : {
                    name : 'menuname',
                    url : 'menuurl'
                },
                simpleData : {
                    enable : true,
                    idKey : 'menuid',
                    pIdKey : 'pid'
                }
            }
        };
        jQuery.fn.zTree.init(jQuery("#permitMenuTree"), setting);
    });
</script>
<fieldset>
  <legend>&nbsp;&nbsp;操作&nbsp;&nbsp;</legend>
  <p style="font-size: 1em; font-weight: bolder; color: blue; text-indent: 2em;">选择一个权限, 中间列表显示已拥有的菜单,
    右侧列表显示可分配菜单列表, 勾选中间列表选项保存时将去除勾选的菜单, 右侧列表与之相反. 点击'保存'按钮进行权限菜单分配!</p>
  <div style="padding: 5px;">
    <button data-dojo-type="dijit/form/Button" type="button" label="保存" onclick="syspermitmenuSubmitForm();"></button>
  </div>
</fieldset>
<div style="float: left; width: 300px;">
  <table id="syspermitmenuGird"></table>
  <div id="syspermitmenuToolbar"></div>
</div>
<input type="hidden" id="permitid">
<div style="float: right;">
  <ul id="permitMenuTree" class="ztree" style="margin-top: 10px; width: 358px; height: 350px; overflow-y: scroll;"></ul>
</div>
<script type="text/javascript">
    jQuery("#syspermitmenuGird").jqGrid({
        url : 'syspermission/queryAsList',
        datatype : "json",
        rownumbers : true,
        width : 400,
        height : 300,
        colNames : [ '权限ID', '权限名称', '描述' ],
        colModel : [ {
            name : 'permitId',
            index : 'permitId',
            width : 60,
            key : true,
            hidden : true,
            align : 'center'
        }, {
            name : 'permitName',
            index : 'permitName',
            width : 200
        }, {
            name : 'description',
            index : 'description',
            width : 150
        } ],
        rowNum : 15,
        rowList : [ 15, 20, 25, 30 ],
        pager : '#syspermitmenuToolbar',
        recordpos : 'right',
        viewrecords : false,
        sortorder : "desc",
        jsonReader : {
            repeatitems : false
        },
        multiselect : false,
        shrinkToFit : false,
        onSelectRow : function(ids) {
            if (ids != null) {
                var syspermit = jQuery("#syspermitmenuGird").jqGrid('getRowData', ids);
                var zTree = jQuery.fn.zTree.getZTreeObj("permitMenuTree");
                zTree.destroy();
                jQuery("#permitid").val(syspermit.permitId);
                var setting = {
                    async : {
                        enable : true,
                        url : "syspermitmenu/queryAsList",
                        otherParam : {
                            "permitid" : jQuery("#permitid").val()
                        }
                    },
                    check : {
                        enable : true,
                        chkboxType : {
                            "Y" : "s",
                            "N" : "ps"
                        }
                    },
                    data : {
                        key : {
                            name : 'menuname',
                            url : 'menuurl'
                        },
                        simpleData : {
                            enable : true,
                            idKey : 'menuid',
                            pIdKey : 'pid'
                        }
                    }
                };
                jQuery.fn.zTree.init(jQuery("#permitMenuTree"), setting);
            }
        },
        caption : "权限列表"
    });
    jQuery("#syspermitmenuGird").jqGrid('navGrid', '#syspermitmenuToolbar', {
        edit : false,
        add : false,
        del : false,
        search : false,
        refresh : true
    });
</script>